<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<link rel="stylesheet" type="text/css" href="../css/common.css?01_24" />
		<link rel="stylesheet" type="text/css" href="../css/templet.css?01_24" />
		<link rel="stylesheet" type="text/css" href="../fonts/font-awesome.min.css?01_24" />
		<link rel="stylesheet" type="text/css" href="../mui/css/mui.css?01_24" />
		<!--公共js-->
		<script type="text/javascript" src="../common/js/jquery.js?01_24"></script>
		<!--插件-->
		<script type="text/javascript" src="../common/js/vue.min.js?01_24"></script>
		<script type="text/javascript" src="../common/js/mui.min.js?01_24"></script>
		<script type="text/javascript" src="../common/js/jquery-validate.js?01_24"></script>
		
		<script type="text/javascript" src="../common/js/fastclick.js?01_24"></script>
		<script type="text/javascript" src="../common/js/common.js?01_24"></script>
		<script type="text/javascript" src="../common/js/main.js?01_24"></script>
		<script type="text/javascript" src="../common/js/app.js?01_24"></script>
		<script type="text/javascript" src="../common/js/my_common.js?01_24"></script>
		<style>
			.error-box.red.center.mag-t-20 i,
			.error-box.red.center.mag-t-20 span {
				display: none;
			}
			
			.error-box.red.center.mag-t-20.error i,
			.error-box.red.center.mag-t-20.error span {
				display: inline-block;
			}
			
			.inp {
				width: 50%;
				text-align: left;
			}
		</style>
	</head>

	<body>
		<header class="bg-red9 fff f-20 pad-t-10 pad-b-10 pad-l-10 pad-r-10">
			<div class="pa back">
				<a href="javascript:back();"></a>
			</div>
			<div class="center" data-l="1015"></div>
		</header>
		<div id="app" class="wrap_body change_password" v-cloak>
			<div class="text pad-t-45">
				<div @click="input_fun" class="item">
					<div class="bank5 bg-grayF5"></div>
					<div class="p fiex pad-l-10 pad-r-10 bg-fff">
						<div style="width: 125px;">{{global_lange[1205]}}</div>
						<div class="fiex1"><input style="width: 100%;" data-valid="isNonEmpty" :data-error="global_lange[1206]" type="password" name="" id="" v-model="form_data.password_old" :placeholder="global_lange[1206]" class="inp pad-t-25 pad-b-25 required" /></div>
						<div @click="close(1)" v-if="form_data.password_old.length!=0" class="close_1"><span class="pa delete_msg"></span></div>
					</div>
				</div>
				<div @click="input_fun" class="item">
					<div class="bank5 bg-grayE9"></div>
					<div class="p fiex pad-l-10 pad-r-10 bg-fff">
						<div style="width: 125px;">{{global_lange[1016]}}</div>
						<div class="fiex1"><input style="width: 100%;" :placeholder="global_lange[1154]" data-valid="isNonEmpty" :data-error="global_lange[1154]" type="password" id="pwd" v-model="form_data.password_new" class="pad-t-25 pad-b-25 inp required" /></div>
						<div @click="close(2)" v-if="form_data.password_new.length" class="close_1"><span class="pa delete_msg"></span></div>
					</div>
				</div>

				<div @click="input_fun" class="item">
					<div class="bank5 bg-grayE9"></div>
					<div class="p fiex pad-l-10 pad-r-10 bg-fff">
						<div style="width: 125px;">{{global_lange[1155]}}</div>
						<div class="fiex1"><input style="width: 100%;" :placeholder="global_lange[1012]" data-matchID="pwd" data-valid="matchPwd" :data-error="global_lange[1014]" type="password" class="pad-t-25 pad-b-25 inp required" v-model="again_pas" /></div>
						<div @click="close(3)" v-if="again_pas.length!=0" class="close_1"><span class="pa delete_msg"></span></div>
					</div>
				</div>
				<div class="bank5 bg-grayE9"></div>
				<!--错误提示-->
				<div class="error-box  red center  mag-t-20" style="height:10px;" id="errortip">
					<span class="mag-r-5 "></span>
				</div>
				<div class="mag-t-30">
					<button @click="form_btn" class="bg-red9 fff pad-l-60 pad-r-60 pad-t-15 pad-b-15 reg_btn">{{global_lange[1008]}}</button>
				</div>
			</div>
		</div>
		<script>
			function fun1() {
				setlange_obj(); //加载头部语言包
				//表单验证
				$('#app').validate({
					selectID: "#errortip" //指定弹出位置
				});
				var app = new Vue({
					el: '#app',
					data: {
						form_data: { //提交数据
							password_old: "", //旧密码
							password_new: "" //新密码
						},
						b_lg: global_lange, //语言包
						again_pas: "" //确认密码
					},
					methods: {
						input_fun: function() {
							var el = event.currentTarget
							$(el).find("input").focus();
						},
						form_btn: function() {
							if($("#app").validate('submitValidate')) {
								common_ajax("1", app.form_data, "put_update_password", function(h) {
									if(h.status == "1") {
										clicked("changePasswordSuccess.html");
									} else {
										mui.toast(h.msg);
									}
								})
							}
						},
						close: function(e) {
							switch(e) {
								case 1:
									app.form_data.password_old = ""
									break;
								case 2:
									app.form_data.password_new = ""
									break;
								case 3:
									app.again_pas = ""
									break;
								default:
									break;
							}
						}
					}
				})
			}
		</script>
	</body>

</html>
